var table;
var $;
var layer;
var form;

var arrUrl = window.location.search.substr(1).split("&");
var param = new Array();
for (var j = 0; j < arrUrl.length; j++) {
    param[j] = decodeURI(arrUrl[j].split("=")[1]);
}

var id = param[0];
var userId = param[1];
var url = param[2];

layui.use(['table','jquery','layer','form'],function () {
    table = layui.table;
    $ = layui.jquery;
    layer = layui.layer;
    form = layui.form;

    $('#id').val(id);

    $.ajax({
        url:'/comment/microcircle/getMicricircleById',
        method:'post',
        dataType:'json',
        data:{id:id},
        success:function(data){
            $('#artcleTitle').text(data.data.artcleTitle);
            $('#createDate').text(data.data.createDate);
            $('#userName').text(data.data.userName);
            $('#show').text(data.data.show);
            $('#artcleKeywords').text(data.data.artcleKeywords);
            $('#acticleCategroyName').text(data.data.acticleCategroyName);
            $('#acticleLike').text(data.data.acticleLike);
            $('#acticleCollection').text(data.data.acticleCollection);
            $('#acticleReviews').text(data.data.acticleReviews);
            $('#acticleHits').text(data.data.acticleHits);
            $('#acticleShare').text(data.data.acticleShare);
            $('#details').text(data.data.details);
            $('#artcleUrl').attr('src',data.data.artcleUrl);
            $('#article').text(data.data.article);

        }
    })

    $('#url').attr('src',url);

    //前台
    $.ajax({
        url:'/comment/microcircle/getBeforeCommentById',
        method:'post',
        dataType:'json',
        data:{id:id},
        success:function(data){
            var content = '';
            $.each(data.data,function (i,e) {
                content +='<div class="top-interval">' +
                    '<img class="layui-circle head-img right-interval" src="'+e.avatarUrl+'"/>' +
                    '<input type="hidden" name="commentId" value="'+e.id+'">' +
                    '<span class="right-interval content">'+e.userName+'</span>' +
                    '<span class="right-interval">'+e.content+'</span>' +
                    '<span class="right-interval content">'+e.commentDate+'</span>' ;
                    if(e.display == '2'){
                        content += '<span class="right-interval"><a href="javascript:editDisplay('+e.id+','+e.display+');" style="color:rgb(13,171,158)">隐藏</a></span>' ;
                    }else{
                        content += '<span class="right-interval"><a href="javascript:editDisplay('+e.id+','+e.display+');" style="color:rgb(13,171,158)">显示</a></span>' ;
                    }
                    content +='</div>';
                if(e.children != null){
                    var parentId = e.id;
                    var userId = e.userId;
                    $.each(e.children,function (i,e) {
                        content += '<div class="top-interval left-interval">' +
                            '<input type="hidden" name="userId" value="'+userId+'">' +
                            '<input type="hidden" name="commentId" value="'+parentId+'">' +
                            '<img class="layui-circle head-img right-interval" src="'+e.avatarUrl+'"/>' +
                            '<span class="right-interval content">'+e.userName+'</span>' +
                            '<span class="right-interval">'+e.content+'</span>' +
                            '<span class="right-interval content">'+e.commentDate+'</span>';
                            if(e.display == '2'){
                                content += '<span class="right-interval"><a href="javascript:editDisplay('+e.id+','+e.display+');" style="color:rgb(13,171,158)">隐藏</a></span>' ;
                            }else{
                                content += '<span class="right-interval"><a href="javascript:editDisplay('+e.id+','+e.display+');" style="color:rgb(13,171,158)">显示</a></span>' ;
                            }
                            content +='</div>';
                    })
                }
            })

            $('.before-comment-content').html(content);

        }
    })

    //后台
    $.ajax({
        url:'/comment/microcircle/getCommentById',
        method:'post',
        dataType:'json',
        data:{id:id},
        success:function(data){
            var content = '';
            $.each(data.data,function (i,e) {
                content +='<div class="top-interval">' +
                    '<img class="layui-circle head-img right-interval" src="'+e.avatarUrl+'"/>' +
                    '<input type="hidden" name="commentId" value="'+e.id+'">' +
                    '<span class="right-interval content">'+e.userName+'</span>' +
                    '<span class="right-interval">'+e.content+'</span>' +
                    '<span class="right-interval content">'+e.commentDate+'</span>' +
                    '<span class="right-interval"><a href="javascript:;" style="color:rgb(13,171,158)">回复</a></span>' +
                    '</div>';
                if(e.children != null){
                    var parentId = e.id;
                    var userId = e.userId;
                    $.each(e.children,function (i,e) {
                        content += '<div class="top-interval left-interval">' +
                            '<input type="hidden" name="userId" value="'+userId+'">' +
                            '<input type="hidden" name="commentId" value="'+parentId+'">' +
                            '<img class="layui-circle head-img right-interval" src="'+e.avatarUrl+'"/>' +
                            '<span class="right-interval content">'+e.userName+'</span>' +
                            '<span class="right-interval">'+e.content+'</span>' +
                            '<span class="right-interval content">'+e.commentDate+'</span>' +
                            '<span class="right-interval"><a href="javascript:;" style="color:rgb(13,171,158)">回复</a></span>' +
                            '</div>';
                    })
                }
            })

            $('.comment-content').html(content);

            //点击回复添加回复
            $('.top-interval').children('span').children('a').click(function (e) {
                //取消此事件冒泡，实现点击空白删除回复
                e.stopPropagation();
                //回复只能出现一个
                $('.new-content').remove();
                var parentId = $(this).parent('span').siblings('input[name=commentId]').val();
                var userId = $(this).parent('span').siblings('input[name=userId]').val();
                //回复模板
                var content = '<div class="new-content top-interval left-interval" >' +
                    '<img class="new-content-img layui-circle head-img right-interval" src="'+param[2]+'"/>' +
                    '<span class="right-interval"><input class="new-content-input layui-input" placeholder="请回复" style="display: inline-block;width: 600px;"></span>' +
                    '<span class="right-interval"><button class="new-content-submit layui-btn" onclick="addComment('+parentId+')" >评论</button></span>' +
                    '</div>';
                //添加
                $(this).parent('span').parent('div').append(content);

            })

            $('.new-content').click(function (e) {
                e.stopPropagation();
                $('.new-content').show();
            })

            //点击空白删除回复
            $('body').click(function (e) {
                var b = new Array();
                //识别特殊类名
                $.each(e.target.classList,function (i,ele) {
                    if(ele =='new-content-img' || ele=='new-content-input' || ele=='new-content-submit' || ele=='new-content'){
                        b[i] = true;
                    }else {
                        b[i] =false;
                    }
                })

                var j = 0;
                //统计数量
                for (var i = 0; i < b.length; i++) {
                    if (b[i] == true){
                        continue;
                    } else {
                        j += 1;
                    }
                }

                //判断数量是否足够，足够隐藏
                if (j == b.length){
                    $('.new-content').hide();
                }

            })



        }
    })





    form.on('submit(sub)', function (data) {
        var json = {
            userId:userId,
            id:id,
            content:data.field.content,
            createDate:getTime(new Date()),
            parentId:data.field.parentId,
        }
        $.ajax({
            url:'/comment/microcircle/addComment',
            method:'post',
            dataType:'json',
            data:json,
            success:function(data){
                if (data.data.id != null){
                    layer.msg("评论成功");
                    location.reload();
                } else {
                    layer.msg("评论失败");
                }
            }
        })
        return false;
    })




    addComment = function addComment(parentId){
        var content = $('.new-content-input').val();
        var json = {
            userId:userId,
            id:id,
            content:content,
            createDate:getTime(new Date()),
            parentId:parentId,
        }
        $.ajax({
            url:'/comment/microcircle/addComment',
            method:'post',
            dataType:'json',
            data:json,
            success:function(data){
                if (data.data.id != null){
                    layer.msg("评论成功");
                    location.reload();
                } else {
                    layer.msg("评论失败");
                }
            }
        })

    }


    editDisplay = function editDisplay(id,display) {
        if (display == '2'){
            display = '3';
        } else if(display == '3'){
            display = '2';
        }
        $.ajax({
            url:'/comment/microcircle/editCommentDisplay',
            method:'post',
            dataType:'json',
            data:{id:id,display:display},
            success:function(data){
                if (data.data > 0){
                    layer.msg("修改成功");
                    location.reload();
                } else {
                    layer.msg("修改失败");
                }
            }
        })
    }


    //顶部时间
    function getTime(date){
        var year = date.getFullYear(); //获取完整的年份(4位,1970-????)
        var month = date.getMonth()+1; //获取当前月份(0-11,0代表1月)
        var today = date.getDate(); //获取当前日(1-31)
        var hour = date.getHours(); //获取当前小时数(0-23)
        var minute = date.getMinutes(); //获取当前分钟数(0-59)
        var second = date.getSeconds(); //获取当前秒数(0-59)
        var nowTime;
        nowTime = year+'-'+fillZero(month)+'-'+fillZero(today)+' '+fillZero(hour)+':'+fillZero(minute)+':'+fillZero(second);
        return nowTime;
    };

    //时间的为零操作
    function fillZero(str){
        var realNum;
        if(str<10){
            realNum	= '0'+str;
        }else{
            realNum	= str;
        }
        return realNum;
    }


})